<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>404</title>
  <!-- import Vue before Element -->
  <script  th:src="@{/js/vue.js}"></script>
  <!-- import axios -->
  <script  th:src="@{/js/axios.js}"></script>
  <!-- import jquery -->
  <script  th:src="@{/js/jquery.min.js}"></script>
  <!-- import element-ui js -->
  <script th:src="@{/element-ui/lib/index.js}"></script>
  <!-- import element-ui CSS -->
  <link rel="stylesheet" th:href="@{/element-ui/lib/theme-chalk/index.css}">

  <!-- import my CSS -->
  <link rel="stylesheet" th:href="@{/css/me.css}">
  <link rel="stylesheet" th:href="@{/css/typo.css}">
  <link rel="stylesheet" th:href="@{/lib/Semantic-UI-1.12.2/semantic.min.css}">
  <script th:src="@{/js/jquery.min.js}"></script>
  <script th:src="@{/lib/Semantic-UI-1.12.2/semantic.min.js}"></script>
</head>
<body>
  <div id="app" class="m-all">
    <!--导航-->
    <nav th:replace="common :: navMenuX">

    </nav>


    <div class="m-container-small m-padded-tb-massive">
      <div class="ui error message m-padded-tb-huge" >
        <div class="ui contianer">
          <h2>404</h2>
          <p>对不起，你访问的资源不存在</p>
        </div>
      </div>
    </div>

    <footer th:replace="common :: footer" ></footer>
  </div>

</body>

<script>

  new Vue({
    el: '#app',
    data() {
      return {
        restaurants: [],
        state: '',
        timeout:  null,
        activeIndex: ''
      }
    },
    computed: {
    },
    methods: {
      querySearchAsync(queryString, cb) {
        var restaurants = this.restaurants;
        var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants;

        clearTimeout(this.timeout);
        this.timeout = setTimeout(() => {
          cb(results);
        }, 3000 * Math.random());
      },
      createStateFilter(queryString) {
        return (state) => {
          return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
        };
      },
      handleSelect(item) {
        console.log(item);
      }
    }
  })
</script>
</html>